{extend name='index@template/base'}{/extend}
{block name='style'}
<style>
    .cal{margin: 15px 15px 0 15px}
    .info-box-icon{
        height: 57px;
        line-height: 57px;
    }
    .info-box{
        min-height: 50px;
        margin-bottom: 0;
        border: 1px solid #ccc;
    }
</style>
{/block}
{block name='script'}{/block}
{block name='content'}
<div class="cal">
    <div class="row">
        <div class="col-md-3 col-sm-3 col-xs-12">
            <div class="info-box">
                <span class="info-box-icon bg-aqua"><i class="fa fa-envelope-o"></i></span>
                <div class="info-box-content">
                    <span class="info-box-text">上架</span>
                    <span class="info-box-number">{$cal.up}</span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <!-- /.col -->
        <div class="col-md-3 col-sm-3 col-xs-12">
            <div class="info-box">
                <span class="info-box-icon bg-green"><i class="fa fa-flag-o"></i></span>

                <div class="info-box-content">
                    <span class="info-box-text">下架</span>
                    <span class="info-box-number">{$cal.down}</span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <!-- /.col -->
        <div class="col-md-3 col-sm-3 col-xs-12">
            <div class="info-box">
                <span class="info-box-icon bg-yellow"><i class="fa fa-files-o"></i></span>

                <div class="info-box-content">
                    <span class="info-box-text">总销量</span>
                    <span class="info-box-number">{$cal.sales}</span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <!-- /.col -->
        <div class="col-md-3 col-sm-3 col-xs-12">
            <div class="info-box">
                <span class="info-box-icon bg-red"><i class="fa fa-star-o"></i></span>

                <div class="info-box-content">
                    <span class="info-box-text">总真实销售</span>
                    <span class="info-box-number">{$cal.sales_real}</span>
                </div>
                <!-- /.info-box-content -->
            </div>
            <!-- /.info-box -->
        </div>
        <!-- /.col -->
    </div>
</div>

<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <div class="box-body">
                <div id="toolbar">
                    <div class="btn-group pull-left mr10">
                        <a class="btn btn-primary" id="add_btn"><i class="fa fa-plus"></i> 新增商品</a>
                    </div>
                    <div class="form-group pull-left mr10" style="margin-left: 15px">
                        <select class="form-control select2" id="sel_status">
                            <option selected="selected" value="-1">全部状态</option>
                            <option value="1">上架</option>
                            <option value="0">下架</option>
                        </select>
                    </div>
                    <div class="form-group pull-left mr10" style="margin-left: 15px">
                        <select class="form-control select2" id="sel_store">
                            <option value="-1">全部店铺</option>
                            {volist name="store_info['rows']" id="vo"}
                            <option value="{$vo.id}">{$vo.text}</option>
                            {/volist}
                        </select>
                    </div>
                </div>
                <table id="table"
                       data-toggle="table"
                       data-striped ="true"
                       data-toolbar ="#toolbar"
                       data-search="true"
                       data-show-refresh="true"
                       data-query-params = "requestParam"
                       data-show-toggle="true"
                       data-show-columns="true"
                       data-show-export="true"
                       data-side-pagination="server"
                       data-pagination="true"
                       data-id-field="id"
                       data-url="{:url('ShopGoods/index_data')}"
                >
                    <thead>
                    <tr>
                        <th data-field="id" data-sortable="true">ID</th>
                        <th data-field="shop_store.name">店铺名称</th>
                        <th data-field="name">商品名称</th>
                        <th data-field="cate_name">分类</th>
                        <th data-field="variant_name">规格</th>
                        <th data-field="price_original">原价</th>
                        <th data-field="price">商城价</th>
                        <th data-field="cover_image" data-formatter="formatCover">封面图</th>
                        <th data-field="sales">销售量</th>
                        <th data-field="sales_real">真实销售量</th>
                        <!--<th data-field="stock">库存</th>-->
                        <!--<th data-field="flag_putaway" data-formatter="formatPutaway">是否上架</th>-->
                        <th data-field="flag_putaway">商品状态</th>
                        <th data-field="operate" data-formatter="formatOperate" data-events="operateEvents" >操作</th>
                    </tr>
                    </thead>
                </table>
            </div><!-- /.box-body -->
        </div><!-- /.box -->

    </div><!-- /.col -->
</div><!-- /.row -->

{/block}
{block name='script_extra'}
<script>
    var add_data_url="{:url('ShopGoods/add')}";
    var edit_data_url="{:url('ShopGoods/edit')}";
    var delete_data_url="{:url('ShopGoods/delete')}";
</script>
<script>
    $('.datetimepicker').datetimepicker({
        format: "Y-m-d",
        lang: 'ch',
        timepicker: false
    });
</script>
<script>
    // <editor-fold defaultstate="collapsed" desc="格式化url">
    function urlFormat(url) {
        if( url.indexOf('.html')){
            url=url.replace('.html','')
        }
        return url;
    }
    // </editor-fold>


    // <editor-fold defaultstate="collapsed" desc="查询">

    $("#sel_status").on('change', function () {
        $('#table').bootstrapTable('refresh');
    })

    $("#sel_store").on('change', function () {
        $('#table').bootstrapTable('refresh');
    })

    //搜索按钮事件
    $("#btn_search").on('click', function () {
        $('#table').bootstrapTable('refresh');
    })

    var temp = {};
    function requestParam(params) {
        temp = {
            limit: params.limit, //页面大小
            offset: params.offset, //页码
            order: params.order,
            sort: params.sort,
            search: params.search,
            islicense: -1,
            flag_putaway: $("#sel_status").val(),
            begindate: $("#begindate").val(),
            enddate: $("#enddate").val(),
            store_id:$("#sel_store").val()
        };
        return temp;
    }

    // </editor-fold>


    // <editor-fold defaultstate="collapsed" desc="添加">
    $('#add_btn').on('click',function () {
        layer_open('添加',urlFormat(add_data_url)+"/store_id/"+storeId)
    });
    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="操作按钮">
    function formatOperate(value,row,index){
        return [
            '<button class="btn btn-warning btn-xs row_edit" href="javascript:void(0)">',
            '<i class="fa fa-edit"></i> 详情/编辑',
            '</button>&nbsp;',
//            '<button class="btn btn-warning btn-xs row_variant" href="javascript:void(0)">',
//            '<i class="fa fa-edit"></i> 设置规格',
//            '</button>&nbsp;',
            '<button class="btn btn-danger btn-xs row_delete" href="javascript:void(0)">',
            '<i class="fa fa-trash"></i> 删除',
            '</button>'
        ].join('');
    }

    // </editor-fold>

    // <editor-fold defaultstate="collapsed" desc="操作函数">
    window.operateEvents = {
        'click .row_edit': function (e, value, row, index) {
            layer_open('更改店铺信息',urlFormat(edit_data_url)+"/id/"+row.id+"/store_id/"+storeId);
        },
//        'click .row_variant': function (e, value, row, index) {
//            layer_open('添加商品规格',  "{:url('/shop/shop_goods_variant/index/goods_id/"+row.id+"')}");
//        },
        'click .row_delete': function (e, value, row, index) {
            layer.confirm('你确定要删除该选项吗？',{btn:['确定','取消']},function () {
                $.ajax({
                    dataType:'json',
                    data:{id:row.id},
                    url:delete_data_url,
                    success:function (res) {
                        if(res.success){
                            layer.msg(res.message, {time: 1000},function () {
                                window.location.reload();
//                                $('#table').bootstrapTable('refresh');
                            });
                        }else{
                            layer.alert(res.message);
                        }
                    }
                })
            })
        }
    };

    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="时间格式化">
    function formatTime(value) {
        if(value){
            var date = new Date(parseInt(value) * 1000);
            Y = date.getFullYear() + '-';
            M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
            D = (date.getDate() + 1 < 10 ? '0' + (date.getDate()) : date.getDate()) + ' ';
            h = (date.getHours() + 1 < 10 ? '0' + (date.getHours()) : date.getHours()) + ':';
            m = (date.getMinutes() + 1 < 10 ? '0' + (date.getMinutes()) : date.getMinutes()) + ':';
            s = (date.getSeconds() + 1 < 10 ? '0' + (date.getSeconds()) : date.getSeconds());
            return Y + M + D + h + m + s;
        }

    }
    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="cover格式化">
    function formatCover(value) {
       if(value){
           return '<img src="'+value+'" style="width: 60px;height: 60px;">'
       }

    }
    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="状态格式化">
    function formatPutaway(value) {
        switch(value){
            case 0:
                return '<i class="fa fa-minus-circle text-yellow" title="下架">下架</i>';break;
            case 1:
                return '<a href="javascript:;"><i class="fa fa-check-circle text-green" title="点击下架">上架中</i></a>';break;
        }
    }
    // </editor-fold>

</script>
<script>
    //从店铺列表跳转时的相关处理
    var storeId = "{:input('store_id')}";
    if(storeId>0){
//        $('#table').on('load-success.bs.table',function (data) {
//            $(this).bootstrapTable('hideColumn','shop_store.name');
//        })
        $('#sel_store').hide();
        $("#sel_store").find('[value='+storeId+']').attr("selected", true);
        $("#sel_store").find('[value="-1"]').remove();
    }

</script>
{/block}